<template>
  <div class="dialogPower">
    <el-dialog :visible="isShow" @close="closeEvent" title="分配权限">
      <el-tree
        ref="tree"
        :default-expanded-keys="permIds"
        :data="list"
        :props="{ label: 'name' }"
        show-checkbox
        node-key="id"
        check-strictly
      ></el-tree>
      <template>
        <div style="text-align:center">
          <el-button type="primary" @click="submit">确定</el-button>
          <el-button @click="closeEvent">取消</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script>
import { changeTreeData } from '@/utils/index.js'
import { sysPermission } from '@/api/permission'
import { sysRoleGet, sysRoleAssignPremPut } from '@/api/setting'
export default {
  name: 'DialogPower',
  props: {
    isShow: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      list: [],
      info: {},
      permIds: [],
      id: ''
    }
  },
  methods: {
    closeEvent () {
      this.$emit('update:isShow', false)
      this.$refs.tree.setCheckedKeys([])
    },
    // 获取所有权限点
    async getPowerAll () {
      const res = await sysPermission()
      this.list = changeTreeData(res.data, '0')
      console.log('权限列表', res, this.list)
    },
    // 获取角色详情
    async getData (id) {
      const res = await sysRoleGet(id)
      this.id = id
      this.info = res.data
      this.$refs.tree.setCheckedKeys(res.data.permIds)
      console.log(res)
    },
    async submit () {
      await sysRoleAssignPremPut({
        id: this.id,
        permIds: this.$refs.tree.getCheckedKeys()
      })
      this.$message.success('更新权限成功')
      this.closeEvent()
    }
  }
}
</script>

<style></style>
